//document index.less

/**公共部分**/
*{
    margin: 0px;
    padding:0px;
}
a{
    text-decoration: none;
}
ul li{
    list-style: none;
}



/****头部固定位置******/
#header_fixed{
    width: 100%px;
    height: 20px;
    background: #000;
}
/****头部区域开始*****/
#header{
    width: 100%;
    height: 100px;
    .header_content{
        width: 980px;
        height: 100px;
        margin: 0 auto;
        position: relative;
        .logo{
            width: 460px;
            height: 100px;
            position: absolute;
            left:100px;
            top:0px;
            img{
                width:460px;
                height:100px;
            }
        }
        .login{
            width:210px;
            height: 70px;
            position: absolute;
            right: 0px;
            top:0px;
            a{
                display: block;
                width:60px;
                height:70px;
                float: left;
                margin-left:10px;
                background: url(../images/icons.png) -5px -121px;
                text-align: center;
                font:400 12px/60px '微软雅黑';
                color:#000000;
                span{
                    display:block;
                    width:40px;
                    height: 40px;
                    margin: 10px auto;
                    background: url(../images/icons.png) -3px -2px;
                }
                &:hover span{
                    background: url(../images/icons.png) -126px -2px;
                }
            }
        }
        //已登录
       .logined{
           width:400px;
           height: 55px;
           position:absolute;
//         background: orange;
           top:20px;
           right:0px;
           a{
               display:block;
               float: right;
               padding-left:20px;
               font:400 16px/50px '微软雅黑';
               color:#333;
           }
           span{
               color:red;
           }
           .face{
               width:50px;
               height:50px;
               img{
                   width:100%;
                   height:100%;
                   border-radius:25px;
               }
           }
       }
    }
}

/**
     * 菜单栏
 */
#nav{
    width:100%;
    height:54px;
    .nav_content{
        width:980px;
        height:54px;
        margin:0 auto;
        position:relative;
        a{
            display:block;
            font:700 16px/54px '微软雅黑';
            color:#000;
            float:left;
            padding:0px 5px;
            margin-right:30px;
        }
        .search{
            width:235px;
            height:30px;
            position:absolute;
            top:10px;
            right:0px;
            background:url(../images/ico.png) 0px -2144px;
            form{
               .text{
                   display:block;
                   position: absolute;
                   border: none;
                   top: 6px;
                   left: 10px;
                   width:170px;      
                }
                .sbt{
                    display:block;
                    position: absolute;
                    top:6px;
                    right:0px;
                    width:45px;
                    border:none;
                    background:url(../images/ico.png) 8px -2193px;
                } 
            }
            
        }
    }
    
}

/**
     * 产品焦点区域
 */
#focus{
    width:100%;
    height:280px;
    .focus_content{
        width:980px;
        height:280px;
        margin:0 auto;
        .left{
            width:738px;
            height:280px;
            float:left; 
            overflow: hidden;
            position: relative;
            cursor: pointer;
            .img{
                width:738*6px;
                height:280px;
                background:green;
                position: absolute;
                top:0px;
                left:0px;
            }
            .a_img{
                display:block;
                width:738px;
                height:280px;
                float:left;
                img{
                    width:100%;
                    height: 100%;
                }
            }
            .arrows(){
                width:35px;
                height:280px;
                background: rgba(0,0,0,0.6);
                position: absolute;
                cursor: pointer;
                top:0px;
                span{
                    position: absolute;
                    top:120px;
                    left:10px;
                    font:700 30px/25px '宋体';
                    color:#FFF;
                }
            }
            .arrows_left{
               .arrows;
               left:-35px;
            }
            .arrows_right{
                .arrows;
                right:-35px;
            }
        }
        .right{
            width:218px;
            height: 269px;
            border-top:solid 5px #000000;
            border-bottom: solid 5px #D1D3D4;
            float:right;
            background: url(../images/lines.png);
            position: relative;
            img{
                width:218px;
                height:108px;
                margin-top:10px;
            }
            p{
                text-align: center;
                color:#666;
                font:400 16px/22px '微软雅黑';
                margin-top:10px;
            }
            a{
                font: 400 12px/22px '微软雅黑';
                color:#000000;
            }
            span{
                font-size: 14px;
            }
            &.right2{
                background: #FFFFFF;
            }
            .r_face{
                display: block;
                width:60px;
                height: 60px;
                position: absolute;
                top: 20px;
                left:40px;
                background: red;
                img{
                    width:100%;
                    height: 100%;
                    margin-top:0px;
                }
                
            }
            .r_h{
                position: absolute;
                top: 20px;
                left: 110px;
            }
            
            .r_name{
                position: absolute;
                left: 110px;
                top: 60px;
            }
            .r_s,.r_f{
                position: absolute;
                span{
                    color:red;
                }
            }
            .r_s{
                top:100px;
                left: 30px;
            }
            .r_f{
                top: 100px;
                right:30px;
            }
            .r_z{
                position: absolute;
                top: 130px;
                left: 30px;
            }
            .r_t{
                position: absolute;
                top: 130px;
                right:60px;
            }
            .logo{
                position: absolute;
                bottom: 0px;
                left: 0px;
                width: 218px;
                height: 120px;
                img{
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }  
}
/***
 * 分类区域
 */
#channel{
    margin-top:30px;
    width:100%;
    height:170px;
    .channel_cont{
        width:980px;
        height:170px;
        margin:0 auto;
        .channel_top{
            width:980px;
            height:112px;
            border-bottom:solid 3px #000000;
            .c_left{
                width:90px;
                height: 110px;
                float:left;
                background:url(../images/lines.png);
                padding-left:10px;
                .p1{
                    font:400 12px/25px '微软雅黑';
                    color:#666;
                }
                .p2{
                    font:400 25px/25px '微软雅黑';
                    span{
                        font-size:12px;
                        float: right;
                    }
                }
                .p3{
                    font:400 16px/22px '微软雅黑';
                }
            }
            .c_right{
                width:870px;
                height:112px;
                float:right;
                border-top:solid 5px #000000;
                position:relative;
                p{
                    font:400 12px/22px '微软雅黑';
                    color:#666666;
                    padding:0px 10px;
                    position: absolute;
                    top:-18px;
                    left:20px;
                    background:#FFFFFF;
                    
                }
                ul li{
                    margin-top:25px;
                    width:122px;
                    height:58px;
                    float:left;
                    position:relative;
                    a{
                        width: 90px;
                        height:90px;
                        border-radius: 80px;
                        position:absolute;
                        top:-10px;
                        left:0px;
                        &:hover{
                            background: #000000;
                            .cont{
                                color:#FFF;
                            }
                        }
                        .cont{
                            display:block;
                            padding-top:25px;
                            font:400 16px/22px '微软雅黑';
                            color:#000000;
                            width:90px;
                            height:48px;
                            text-align: center;
                        }
                    }
                    .slant{
                        display:block;
                        width:36px;
                        height:58px;
                        position: absolute;
                        top:0px;
                        right:0px;
                        background: url(../images/icos2.png) no-repeat 0px -230px;
                        
                    }
                }
            }
            
        }
        .channel_time{
            height:40px;
            .c_time{
                float:left;
                width:115px;
                height:30px;
                margin-top:10px;
                background:url(../images/icos2.png) no-repeat 0px -203px;
                font:400 12px/25px '微软雅黑';
                color:#FFF;
                text-align: center;
            }
            .c_run{
                width:860px;
                height:40px;
                float:left;
                li{
                    font:12px/35px '微软雅黑';
                    color:#CC9E96;
                    float:left;
                    padding:0 30px;
                }
            }
            
        }
    }
}

/***
 * 主体区
 */
#main{
    width:980px;
    margin: 30px auto;
    /***
     * 限时购
     */
    .limit{
        width:980px;
        height:394px;
        .l_bar{
            width:970px;
            height:30px;
            border-left:solid 10px #000000;
            font:400 20px/30px "微软雅黑";
            letter-spacing:5px;
            text-indent: 10px;
            margin-bottom:10px;
        }
        .l_cont{
            width:980px;
            height:322pox;
            a{
                display: block;
                width:480px;
                height:322px;
                float:left;
                margin-right:20px;
                img{
                    width:100%;
                    height:100%;
                }
            }
        }
    }
    /***
     * 产品分类（女人广场，男人广场，生活家广场）
     */
    
    .product{
        width:980px;
//      height:803px;
        margin-top:30px;
        //分界线
        .line{
            margin-top:30px;
            width:980px;
            height:10px;
            background:url(../images/line.png) repeat;
        }
        //分界线结束
        .p_bar{
            margin-bottom: 10px;
            width:980px;
            height:30px;
            h2{
                width:112px;
                height:28px;
                font:400 18px/28px '微软雅黑';
                color:#FFF;
                padding:0px 10px;
                float:left;
                background:#000000;
            }
            span{
                display:block;
                float:left;
            }
            span.s1{
                width:29px;
                height:28px;
                background:url(../images/p_icons.png) no-repeat 0px -20px;
            }
            span.s2{
                font:400 16px/28px '微软雅黑';
            }
            span.s3{
                width:20px;
                height:28px;
                background: url(../images/p_icons.png) no-repeat right -20px;
            }
        }
        
        .p_cont{
            width:980px;
            overflow: hidden;
            .a_img{
               display:block;
               width:316px;
               height:316px;
               float:left;
               margin-right:10px;
               margin-bottom:10px;
               position:relative;
               &:hover span{
                   background: rgba(0,0,0,0.8);
                   color:#FFF;
               }
               img{
                   width:100%;
                   height:100%;
               }
               span{
                   display:block;
                   width:316px;
                   height:30px;
                   position: absolute;
                   bottom:0px;
                   left:0px;
                   font:400 14px/30px '微软雅黑';
                   color:#888;
                   text-align: center;
                   background: rgba(255,255,255,0.8);
               }
            }
        }
        
        .p_class{
            margin-top:20px;
            width:980px;
            height:48px;
            position: relative;
            .all{
                width:48px;
                height:48px;
                position: absolute;
                top: 0px;
                right:0px;
                a{
                    display:block;
                    width:48px;
                    height:48px;
                    background: url(../images/p_icons.png) 0px -96px;
                    font:400 14px/45px '微软雅黑';
                    text-align:center;
                    color:#222;
                    &:hover{
                        background: url(../images/p_icons.png) -296px -96px;
                        color:#FFF;
                    }
                }
            }
            dl{
                width:240px;
                height:42px;
                float:left;
                dt{
//                  width:50px;
                    padding-right: 10px;
                    height:42px;
                    text-align: center;
                    border-right:solid 3px #000000;
                    float:left;
                    a{
                        font:400 14px/42px '微软雅黑';
                        color:#222;
                    }
                }
                dd{
                    float:left;
                    width:150px;
                    height:21px;
                    padding-right:10px;
                    a{
                        float:left;
                        padding:0px 10px;
                        font:400 12px/22px '微软雅黑';
                        color:#666;
                        border:1px solid #FFF;
                        &:hover{
                            border-radius:10px;
                            border:1px solid #E0BCA5;
                        }
                    }  
                }
            }
        }
        
        
    }
    /*******生活家广场********/
    .productman{
        width:980px;
        height:580px;
        .p_cont{
            width: 980px;
            height:381px;
            .a_img{
                width:381px;
                height:381px;
                span{
                    width:381px;
                }
            }
            .d_img{
                width:190px;
                height: 381px;
                float:left;
                .m_img{
                    display:block;
                    position:relative;
                    width:190px;
                    height:184px;
                    margin-bottom:13px;
                    &:hover span{
                        background:rgba(0,0,0,0.8);
                    }
                    img{
                        width:100%;
                        height:100%;
                    }
                    span{
                       display:block;
                       width:190px;
                       height:30px;
                       position: absolute;
                       bottom:0px;
                       left:0px;
                       font:400 14px/30px '微软雅黑';
                       color:#888;
                       text-align: center;
                       background: rgba(255,255,255,0.8);
                    }
                }  
            }
        }
    }
    
    /*********生活家广场***********/
    .productlive{
        width:980px;
//      height:660px;
        .p_cont{
            width:980px;
//          height:236*2+10px;
            .l_img{
                width:235px;
                height: 236px;
                span{
                    width:236px;
                }
            }
        }
    }
    
      
}

/***
 * 网站底部begin
 */
#footer{
    width:100%;
    height:255px;
    background:#000000;
    .foot_wrap{
        width: 980px;
        height:255px;
        margin:0 auto;
        .say{
            width:675px;
            height:115px;
            float:left;
            .p1{
                font:400 18px/80px '微软雅黑';
                color:#FFF;
            }
            .p2{
                font:400 16px/50px '微软雅黑';
                color:#FFF;
                text-align:right;
            }
        }
        .foot-logo{
            width:220px;
            height:200px;
            float:left;
        }
        p.infor{
            float:left;
            width:980px;
            height:30px;
            border-bottom:1px solid #666;
            margin-top:30px;
            font:400 12px/22px '微软雅黑';
//          text-align:center;
            color:#666;
            a{
                color:#666;
            }
        }
        p.link{
            float:left;
            font:400 12px/22px '微软雅黑'; 
            color:#666;
        }
    }
}



/***
 * 网站底部end
 */






















